<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
        var _name="数据值";
        var data={};
        Object.defineProperty(data,"name",{
            get(){
                console.log("get被调用");
                //return就是把_name的值给data.name
                return _name;
            },
            //当给name赋值时，调用set，newValue为赋的值
            set(newValue){  
                console.log("set被调用",newValue);
                // 如果直接给data.name=newValue会再调用set，形成死循环
                // 所以借用_name变量
                _name=newValue;
            }
        })

        var _value="";
        var obj={};
        Object.defineProperty(obj,"value",{
            get(){
                return _value;
            },
            set(v){
                _value=v;
                let h1Dom=document.getElementById("h1Dom");
                h1Dom.textContent=v;
            }
        })

        function changeValue(datas){
            obj.value=datas;
        }
    </script>
</head>
<body>
    <h1 id="h1Dom"></h1>
    <input type="text" id="inputDom" oninput="changeValue(this.value)">
</body>
</html>